<template>
  <div id="docDEtail">
    <el-button type="info" size="mini" @click="goBack">返回</el-button>
    <div class="markdown-body">

      <DMmarkdownRender v-if="queryName == DOC.DMmarkdownRender">
        <template v-slot:footer>
          <div>已经到底部啦~~~</div>
        </template>
      </DMmarkdownRender>
      <DMBuiltInCommands v-else-if="queryName == DOC.DMBuiltInCommands"/>
      <DMvueUpData v-else-if="queryName == DOC.DMvueUpData" />
      <DMvueSet v-else-if="queryName == DOC.DMvueSet" />
      <DMvmodel v-else-if="queryName == DOC.DMvmodel" />
      <DMfilters v-else-if="queryName == DOC.DMfilters">
        <template v-slot:bootcdn>
        <a href="https://www.bootcdn.cn/" target="_blank">bootcdn的地址</a>
        </template>
       
      </DMfilters>

      <DMwatchComputer v-else-if="queryName == DOC.DMwatchComputer"/>
      <DMBuiltInCommands v-else-if="queryName == DOC.DMBuiltInCommands"/>
      <DMvuePlugins v-else-if="queryName == DOC.DMvuePlugins"/>
      <DMlifeCycle v-else-if="queryName == DOC.DMlifeCycle"/>
      <DMregularExpression v-else-if="queryName == DOC.DMregularExpression"/>
      <DMvautoImport v-else-if="queryName == DOC.DMvautoImport"/>
      <DMvcomponents v-else-if="queryName == DOC.DMvcomponents"/>
      <DMRenderFn v-else-if="queryName == DOC.DMRenderFn"/>
      <DMref v-else-if="queryName == DOC.DMref"/>
      <DMvueminxn v-else-if="queryName == DOC.DMvueminxn"/>
      <DMprops v-else-if="queryName == DOC.DMprops"/>
      <DMtodoList v-else-if="queryName == DOC.DMtodoList"/>
      <DMlocalStore v-else-if="queryName == DOC.DMlocalStore"/>
      <DMselfEvent v-else-if="queryName == DOC.DMselfEvent"/>
      <DMVueEventBus v-else-if="queryName == DOC.DMVueEventBus"/>
      <DMVuePubSub v-else-if="queryName == DOC.DMVuePubSub"/>
      <DMvueAnimation v-else-if="queryName == DOC.DMvueAnimation"/>
      <DMmyAxios v-else-if="queryName == DOC.DMmyAxios"/>
      <DMVueSlot v-else-if="queryName == DOC.DMVueSlot"/>
      <DMvuevueX v-else-if="queryName == DOC.DMvuevueX"/>
      <DMVueRoute v-else-if="queryName == DOC.DMVueRoute"/>
      <DMUI v-else-if="queryName == DOC.DMUI"/>
      <DMgit v-else-if="queryName == DOC.DMgit"/>
      <DMnetWork v-else-if="queryName == DOC.DMnetWork"/>
      <DMmodel v-else-if="queryName == DOC.DMmodel"/>
      <DMAJAX v-else-if="queryName == DOC.DMAJAX"/>
      <DMJSES v-else-if="queryName == DOC.DMJSES"/>
      <DMHttpStatus v-else-if="queryName == DOC.DMHttpStatus"/>
      <DMperformanceOptimization v-else-if="queryName == DOC.DMperformanceOptimization"/>
      <DMJS v-else-if="queryName == DOC.DMJS"/>
      <DMCss v-else-if="queryName == DOC.DMCss"/>
      <DMwxrouter v-else-if="queryName == DOC.DMwxrouter"/>
      <DMwxlifecycle v-else-if="queryName == DOC.DMwxlifecycle"/>
      <DMwxbasicknowledge v-else-if="queryName == DOC.DMwxbasicknowledge"/>
      <DMjavaJDK v-else-if="queryName == DOC.DMjavaJDK"/>
      <DMhelloword v-else-if="queryName == DOC.DMhelloword"/>
      <DMwebpack_Concept v-else-if="queryName == DOC.DMwebpack_Concept"/>
      <DMwebpackFirstLearn v-else-if="queryName == DOC.DMwebpackFirstLearn"/>
      <DMwebpackConfig v-else-if="queryName == DOC.DMwebpackConfig"/>
      <DMwebpackSourceMap v-else-if="queryName == DOC.DMwebpackSourceMap"/>
      <DMwebpackDisposeHtml v-else-if="queryName == DOC.DMwebpackDisposeHtml"/>
      <DMwebpackDisposeCss v-else-if="queryName == DOC.DMwebpackDisposeCss"/>
      <DMwebpackDisposeImg v-else-if="queryName == DOC.DMwebpackDisposeImg"/>
      <DMwebpackDisposeBabel v-else-if="queryName == DOC.DMwebpackDisposeBabel"/>
      <DMwebpackMorePage v-else-if="queryName == DOC.DMwebpackMorePage"/>
      <DMwebpackOtherPlugin v-else-if="queryName == DOC.DMwebpackOtherPlugin"/>
      <DMwebpackDisEnv v-else-if="queryName == DOC.DMwebpackDisEnv"/>
      <DMwebpackCrossDomain v-else-if="queryName == DOC.DMwebpackCrossDomain"/>
      <DMFloatingLayout v-else-if="queryName == DOC.DMFloatingLayout"/>
      <DM01studyPrint v-else-if="queryName == DOC.DM01studyPrint"/>
      <DM02studyVariable v-else-if="queryName == DOC.DM02studyVariable"/>
      <DM03studyType v-else-if="queryName == DOC.DM03studyType"/>
      <DM04studyTypeTransform v-else-if="queryName == DOC.DM04studyTypeTransform"/>
      <DM05studyInput v-else-if="queryName == DOC.DM05studyInput"/>
      <DM06studyOperation v-else-if="queryName == DOC.DM06studyOperation"/>
      <DM07studyCompare v-else-if="queryName == DOC.DM07studyCompare"/>
      <DM08studyOrganization v-else-if="queryName == DOC.DM08studyOrganization"/>
      <DM09studyPass v-else-if="queryName == DOC.DM09studyPass"/>
      <DM10studyRange v-else-if="queryName == DOC.DM10studyRange"/>
      <DM11studyWhile v-else-if="queryName == DOC.DM11studyWhile"/>
      <DM12studyForIn v-else-if="queryName == DOC.DM12studyForIn"/>
      <DM13studyBreakContinue v-else-if="queryName == DOC.DM13studyBreakContinue"/>
      <DM14studyNestedLoop v-else-if="queryName == DOC.DM14studyNestedLoop"/>
      <DM15studyList v-else-if="queryName == DOC.DM15studyList"/>
      <DM16studyDictionaries v-else-if="queryName == DOC.DM16studyDictionaries"/>
      <DM17studyTuple v-else-if="queryName == DOC.DM17studyTuple"/>
      <DM18studyAssemble v-else-if="queryName == DOC.DM18studyAssemble"/>
      <DM19studyStr v-else-if="queryName == DOC.DM19studyStr"/>
      <DM20studyfnCreate v-else-if="queryName == DOC.DM20studyfnCreate"/>
      <DM21studyRecursionFn v-else-if="queryName == DOC.DM21studyRecursionFn"/>
      <DM22studyTryExcept v-else-if="queryName == DOC.DM22studyTryExcept"/>
      <DM23studyTryExceptElse v-else-if="queryName == DOC.DM23studyTryExceptElse"/>
      <DM24studyTryExceptElseFinally v-else-if="queryName == DOC.DM24studyTryExceptElseFinally"/>
      <DM25studyTraceback v-else-if="queryName == DOC.DM25studyTraceback"/>
      <DM26studyClassEncapsulation v-else-if="queryName == DOC.DM26studyClassEncapsulation"/>
      <DM27studyClassInherit v-else-if="queryName == DOC.DM27studyClassInherit"/>
      <DM28studyClassOverwirte v-else-if="queryName == DOC.DM28studyClassOverwirte"/>
      <DM29studyClassObject v-else-if="queryName == DOC.DM29studyClassObject"/>
      <DM30studyClassPolymorphic v-else-if="queryName == DOC.DM30studyClassPolymorphic"/>
      <DM31studyClassAttribute v-else-if="queryName == DOC.DM31studyClassAttribute"/>
      <DM32studyModule v-else-if="queryName == DOC.DM32studyModule"/>
      <DM33studyIntall v-else-if="queryName == DOC.DM33studyIntall"/>
      <DM34studyEncoding v-else-if="queryName == DOC.DM34studyEncoding"/>
      <DM35studyIO v-else-if="queryName == DOC.DM35studyIO"/>
      <DM36studyWith v-else-if="queryName == DOC.DM36studyWith"/>
      <DM37studyOs v-else-if="queryName == DOC.DM37studyOs"/>
      <DMpaging v-else-if="queryName == DOC.DMpaging"/>
      <DMupload v-else-if="queryName == DOC.DMupload"/>
      <DMlayoutGrild v-else-if="queryName == DOC.DMlayoutGrild"/>
      <DMecharts v-else-if="queryName == DOC.DMecharts"/>
      <div v-else>老铁没内容~</div>

    </div>
  </div>
</template>
<script>
import DOC,{fileMdObj} from './index'
export default {
  components: fileMdObj, // 引入组件并注册
  beforeRouteEnter(to, from, next) {
    next((vm) => {
      console.log("to.query.name==",to.query.name);
      // console.log('333=',this.DOC.DM01_study_print)
      
      // 虽然beforeRouteEnter不可以获取this,但可以通过next回调参数得到this的对象
      vm.queryName = to.query.name;
      
    });
  },
  
  data() {
    return {
      fileMdObj,
      DOC,
      queryName: "",
      scrollTop: 0,
      tabOffsetTop: 0,
      scroll: ''
    };
  },
  methods: {
    goBack() {
      this.$router.back();
    },
  },

  mounted(){
  }
};
</script>